<template>
  <a-drawer :open="visible" title="司机对账详情" @close="onClose">
    <template #closeIcon>
      <close @on-close="onClose" />
    </template>
    <a-card size="small" title="基本信息" class="smart-margin-bottom10">
      <a-descriptions size="small" :column="3">
        <a-descriptions-item label="源单编号">{{ options.no }}</a-descriptions-item>
        <a-descriptions-item label="门店名称">{{ options?.store?.store_name }}</a-descriptions-item>
        <a-descriptions-item label="订单类型">{{ TagType[options.order_type] }}</a-descriptions-item>
        <a-descriptions-item label="订单商品数量">{{ options?.order_num }}</a-descriptions-item>
        <a-descriptions-item label="订单金额">{{ options?.discounted_amount }}</a-descriptions-item>
        <a-descriptions-item label="结算方式">{{ options?.payment_type_text }}</a-descriptions-item>
        <a-descriptions-item label="制单员">{{ options.creator_name }}</a-descriptions-item>
        <a-descriptions-item label="制单日期">{{ options.create_time }}</a-descriptions-item>
        <a-descriptions-item label="源单备注">{{ options.remark }}</a-descriptions-item>
      </a-descriptions>
    </a-card>
    <a-card size="small" title="签收信息" class="smart-margin-bottom10">
      <a-descriptions size="small" :column="3">
        <a-descriptions-item label="配送状态">{{ TagStatus[options.status] }}</a-descriptions-item>
        <a-descriptions-item label="签收金额">{{ options?.sign?.sign_amount }}</a-descriptions-item>
        <a-descriptions-item label="司机">{{ options?.delivery?.driver?.name }}</a-descriptions-item>
        <a-descriptions-item label="签收状态">{{ options?.sign?.is_abnormal === 2 ? '异常' : '正常' }}</a-descriptions-item>
        <a-descriptions-item label="签收结算">{{ options.sign.is_combined_pay == 1 ? options.sign.payments_detail.map((item) => item.label).join(',') : PaymentType[options?.sign?.payment_type] }}</a-descriptions-item>
        <a-descriptions-item label="司机收款">{{ options?.sign?.sign_amount }}</a-descriptions-item>
        <a-descriptions-item label="签收图片">
          <a-image-preview-group>
            <div v-for="item in options?.sign?.certificate?.split(',')" style="display: inline-block; margin-right: 5px">
              <a-image :width="options?.sign?.certificate ? 30 : 50" :src="item || failImg" />
            </div>
          </a-image-preview-group>
        </a-descriptions-item>
        <a-descriptions-item label="签收备注">{{ options?.sign?.remark }}</a-descriptions-item>
        <a-descriptions-item label="签收日期">{{ options?.sign?.create_time }}</a-descriptions-item>
      </a-descriptions>
    </a-card>
    <a-card class="smart-margin-bottom10" size="small" :tab-list="tabList" :active-tab-key="activeKey" @tabChange="(key) => (activeKey = key)">
      <!-- <span v-if="options.sign" style="color: red; font-size: 14px">*待回库////司机补差：￥10.00</span> -->
      <template #customTab="{ tab }">
        <span class="ant-card-head-title" :style="compactModeClass"> {{ tab }} </span>
      </template>
      <template v-if="activeKey === 'pick'">
        <InventorySalesmanTable :enterpriseId="options.detail" :optionsIndex="optionsIndex" :orderType="options.order_type" />
      </template>
      <!-- <template v-if="activeKey === 'return'">
        <ReturnGoodsTable :enterpriseId="options" :optionsIndex="optionsIndex" />
      </template> -->
    </a-card>
    <a-card size="small" title="司机交账" class="smart-margin-bottom10">
      <a-descriptions size="small" :column="4">
        <a-descriptions-item label="交账状态">{{ options?.sign?.is_account == 1 ? '未交账' : '已交账' }}</a-descriptions-item>
        <a-descriptions-item label="金额">{{ options?.reconciliation_amount || 0 }}</a-descriptions-item>
        <a-descriptions-item label="财务">{{ options?.sign?.payee_user }}</a-descriptions-item>
        <a-descriptions-item label="交账时间">{{ options?.sign?.recheck_time }}</a-descriptions-item>
      </a-descriptions>
    </a-card>
    <template #footer>
      <a-button @click="onClose" style="margin-right: 8px">取消</a-button>
      <a-button @click="onCheck" v-if="options?.is_abnormal === 2 && options?.sign?.recheck_status !== 1" type="primary">通过异常审核</a-button>
    </template>
  </a-drawer>
</template>

<script setup lang="ts">
import { message } from 'ant-design-vue'
import InventorySalesmanTable from './inventory-salesman-table.vue'
import ReturnGoodsTable from './return-goods-table.vue'
import { driverAccountApi } from '@/api/business/finance/reconciliation-api'
import { useEnums } from '@/hooks/plugins/useEnums'
import failImg from '@/assets/images/notice/failImg.png'
const compactModeClass = inject('compactModeClass')
const { getDescByValue } = useEnums()
const emit = defineEmits(['refresh'])
enum TagType {
  '销售' = 1,
  '退货',
  '换货'
}

const enum PaymentType {
  '现结' = 1,
  '欠款',
  '预付款',
  '0元赠',
  '押金'
}

enum TagStatus {
  '待审核' = 1,
  '待出库',
  '待签收',
  '已完成',
  '已取消',
  '异常'
}

// --------------------- Drawer 显示与隐藏 ---------------------
// 是否展示
const visible = ref(false)
// 详情
const options = ref({})
// 详情tab
const activeKey = ref('pick')
const tabList = [
  {
    key: 'pick',
    tab: '签收明细'
  }
  // {
  //   key: 'return',
  //   tab: '回库明细'
  // }
]
// 商品
const optionsIndex = ref('')

async function showDrawer(item, index) {
  optionsIndex.value = index
  const id = item.order_id.split('_')[1]
  const res = await driverAccountApi.getDetail({ id })
  options.value = res.data
  visible.value = true
}

const onClose = () => {
  visible.value = false
}

const onCheck = async () => {
  try {
    const res = await driverAccountApi.reCheck({ id: options.value.sign.id, recheck_status: 1 })
    message.success(res.msg || '操作成功')
    emit('refresh')
    onClose()
  } catch (error) {
    message.error(error.msg || '操作失败，请稍后再试')
  }
}
defineExpose({
  showDrawer
})
</script>
